<template>
    <real-el-button :disabled="!useAllow" @click.prevent="btnClick">
        <slot></slot>
    </real-el-button>
</template>
<script setup lang="ts">
import { ElButton as RealElButton } from 'element-plus'
import { computed, useAttrs } from 'vue'
import { ElMessageBox } from 'element-plus'
defineOptions({ name: 'ElButton' })

const props = defineProps(['prevent', 'openType', 'allow'])

const emit = defineEmits(['async'])

const { allow } = props

const useAllow = computed(() => {
    if (allow) {
        if (allow.length) {
            if (!eval(allow.table.selectedData.length + allow.length)) {
                return false
            }
        }
        if (allow.key && allow.value) {
            if (allow.key.includes(',') && allow.value.includes(',')) {
                const keys = allow.key.split(',')
                const vals = allow.value.split(',')
                if (keys.length !== vals.length) {
                    console.warn('allow.key 和 allow.value 无法一一对应')
                    return false
                }
                let go = true
                for (let i = 0; i < allow.table.selectedData.length; i++) {
                    const item = allow.table.selectedData[i]
                    for (let j = 0; j < keys.length; j++) {
                        const k = keys[j]
                        if (item[k] !== vals[j]) {
                            go = false
                            break;
                        }
                    }
                    if (!go) {
                        break
                    }
                }
                return go
            } else if (Array.isArray(allow.key) && Array.isArray(allow.value)) {
                if (allow.key.length !== allow.value.length) {
                    console.warn('allow.key 和 allow.value 无法一一对应')
                    return false
                }
                let go = true
                for (let i = 0; i < allow.table.selectedData.length; i++) {
                    const item = allow.table.selectedData[i]
                    for (let j = 0; j < allow.key.length; j++) {
                        const k = allow.key[j]
                        if (Array.isArray(allow.value[j])) {
                            if (!allow.value[j].includes(item[k])) {
                                go = false
                                break;
                            }
                        } else {
                            if (item[k] !== allow.value[j]) {
                                go = false
                                break;
                            }
                        }
                    }
                    if (!go) {
                        break
                    }
                }
                return go
            } else {
                return allow.table.selectedData.every(item => item[allow.key] === allow.value)
            }
        }
    }
    return true
})


const attrs: any = useAttrs()
const win: any = window
let preventClick = false

const btnClick = () => {
    if (attrs.click) {
        attrs.onClick()
        if (props.openType) {
            win[props.openType] && win[props.openType]()
        }
    }
    if (!preventClick) {
        preventClick = true
        emit('async', () => {
            setTimeout(() => {
                preventClick = false;
                if (props.openType) {
                    win[props.openType] && win[props.openType]()
                }
            }, 200)
        })
    }

    if (attrs.onConfirm) {
        if (props.prevent === false) {
            attrs.onConfirm()
            if (props.openType) {
                win[props.openType] && win[props.openType]()
            }
        } else {
            ElMessageBox.confirm(
                '当前内容可能存在修改，确认继续?',
                '提示',
                {
                    confirmButtonText: '确认',
                    cancelButtonText: '取消',
                    type: 'warning',
                }
            ).then(() => {
                attrs.onConfirm()
                if (props.openType) {
                    win[props.openType] && win[props.openType]()
                }
            }).catch(() => {
            })
        }
    } else {
        if (props.openType) {
            win[props.openType] && win[props.openType]()
        }
    }
}
</script>